<!-- 登陆方式页面  -->
<template>
	<view class="layout loginBg">
		<view class="logo">
			<image src="/common/images/logo.png" mode="scaleToFill"></image>
		</view>
		<view class="content">
			<view class="login-1" @click="weChatLogin">
				<uni-icons type='weixin' size='25'></uni-icons>
				<view class="text">微信登录</view>
			</view>
			<view class="login-2" @click="back()">
				<uni-icons type='undo' size='25'></uni-icons>
				<view class="text">暂不登录</view>
			</view>

		</view>
	</view>
</template>

<script setup>
	import {
		ref,
		computed,
		onMounted
	} from "vue"
	import {
		onLoad,
		onReady,
		onPageScroll,
		onShow,
		onReachBottom,
		onPullDownRefresh
	} from "@dcloudio/uni-app"
	import {
		loginByWeChat
	} from "@/api/user.js"
	import {
		useUserInfoStore
	} from "@/stores/modules/user.js"
	import {
		generateTimestamp
	} from "@/utils/common.js"
	const userTokenInfo = useUserInfoStore();

	const back = () => {
		uni.switchTab({
			url: "/pages/user/user"
		})
	}

	const redirect = ref(null)

	onLoad((getData) => {
		// 查看是否有重定向地址
		redirect.value = getData.redirect;
		console.log("重定向地址", redirect.value);
	})


	// 微信登录
	const weChatLogin = () => {

		// #ifdef H5
		uni.showToast({
			title: "Web无法登录！",
			icon: "error"
		})
		// #endif


		// #ifndef H5
		// 登录，先检查当前用户是否已经注册过
		uni.login({
			"provider": "weixin",
			"onlyAuthorize": true, // 微信登录仅请求授权认证
			success: function(event) {
				const {
					code
				} = event
				//客户端成功获取授权临时票据（code）,向业务服务器发起登录请求。
				loginByWeChat(event.code).then((res) => {
					console.log("res:", res);
					if (res.code == 200) {

						// 获取优化数据信息，以及token信息
						console.log("返回信息：", res.data);
						// 将返回用户信息保存到store中
						userTokenInfo.saveUserInfo(res.data);

						// 设置登陆状态
						uni.setStorageSync("isLogin", true)
						// 更新缓存的用户信息
						uni.setStorageSync("userInfo", res.data)
						// 更新用户登录的时间戳
						uni.setStorageSync("loginTime", generateTimestamp())
						uni.showToast({
							title: '登录成功',
							duration: 500
						});

						// 判断是否有重定向地址
						if (redirect.value) {

							// 判断是否是TabBar页面（好像都是TabBar页面）
							console.log("重定向地址", redirect.value);
							setTimeout(() => {
								// 跳转至主面并刷新页面
								uni.switchTab({
									url: `/${redirect.value}`
								})
							}, 500)
						}
					}

					if (res.code == 500) {
						// 登录失败
						uni.showToast({
							title: "登录失败",
							icon: "error",
							duration: 500
						})
					}
					setTimeout(() => {
						redirect.value = null;
					}, 1000)
				})

			},
			fail: function(err) {
				// 登录授权失败
				// err.code是错误码  弹窗显示失败
			},
		})
		// #endif

	}
</script>

<style lang="scss" scoped>
	.layout {
		display: flex;
		flex-direction: column;
		position: relative;

		.logo {
			display: flex;
			justify-content: center;
			align-items: center;
			height: 300rpx;
			position: inherit;
			top: 100rpx;

			image {
				max-width: 394rpx;
				max-height: 111rpx;

			}
		}

		.content {
			display: flex;
			justify-content: center;
			align-items: center;
			flex-direction: column;
			height: 400rpx;
			margin-top: 130rpx;

			.login-1 {
				width: 600rpx;
				height: 100rpx;
				margin: 20rpx auto;
				border-radius: 50rpx;
				background-color: #39BDAB;
				display: inherit;
				justify-content: center;
				align-items: center;

				.text {
					color: #fff;
					font-size: 35rpx;
					margin-left: 10rpx;
				}
			}

			.login-2 {
				width: 600rpx;
				height: 100rpx;
				margin-top: 40rpx;
				margin: 20rpx auto;
				border-radius: 50rpx;
				background-color: #fff;
				border-color: #39BDAB;
				border-width: 2rpx;
				border-style: solid;
				display: inherit;
				justify-content: center;
				align-items: center;

				.text {
					font-size: 35rpx;
					margin-left: 10rpx;
				}

			}
		}
	}
</style>